/*
  学习目标：React创建元素-练习
  步骤：
     1. 
     2. 
     3. 
*/
import React from 'react'
import ReactDOM from 'react-dom'



// 💥class是关键字, 不能作为js的属性名,  使用className替代class属性名
// const divNode = React.createElement("div", {id: "box", className:"demo"}, "这是一个React案例")






// v-html
const liNode1 =  React.createElement("li", null, "香蕉")
const liNode2 =  React.createElement("li", null, "橘子")
const liNode3 =  React.createElement("li", null, "苹果")
// 💥React不会自动解析html字符串
const ulNode = React.createElement("ul", {className: "list"},liNode1, liNode2, liNode3)

// 💥 render方法全家只能调用一次, 最后一次会覆盖前面所有的render
// ReactDOM.render(divNode, document.getElementById("root"))
ReactDOM.render(ulNode, document.getElementById("root"))